<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>
      Vysor
    </title>
    <script src='common/jquery-2.1.1.min.js' type="text/javascript"></script>

    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">

    <script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

    <script src="require.js" type="text/javascript"></script>
    <script src='farm-access.js' type="text/javascript"></script>
    <script src='whitelist.js' type="text/javascript"></script>
    <script src='uglify-whitelist.js' type="text/javascript"></script>
    <style>
    textarea {
       position:absolute; top:150px; left:0; right:0; bottom: 50px; padding:1em;
    }
    body {
/*      font-family: 'Roboto', sans-serif;*/
    }
    .navbar-inverse .navbar-brand {
      color: white;
    }

    .navbar-inverse {
      background-color: #4696e5;
      border-color: #4696e5;
    }

    .navbar {
      border-radius: initial;
      margin-bottom: 0px;
    }

    .navbar a {
      border-bottom: initial;
    }

    .navbar-inverse .navbar-nav>li>a {
      color: white;
    }
    </style>
  </head>
  <body>
    <div class="navbar navbar-inverse">
      <div class="container-fluid">
        <div class="navbar-header">
          <a class="navbar-brand" href="#">Vysor Whitelist</a>
        </div>
      </div>
    </div>
    <div class='well'>
      <label>Server Access</label>
      <select id='server-mode' class="form-control">
        <option>
          Whitelist
        </option>
        <option>
          Open Server - no authentication
        </option>
        <option>
          Vysor Enterprise
        </option>
      </select>
    </div>
    <textarea class="form-control"></textarea>
    <div class="navbar navbar-default navbar-fixed-bottom">
      <div class="container-fluid">
        <div class='navbar-header'>
          <a class="navbar-text" href="#" id='save'>Save</a>
        </div>
      </div>
    </div>
  </body>
</html>
